{% extends 'base.html' %}
{% load static %}
{% load django_bootstrap5 %}

{% block title %}注册 - 商城系统{% endblock %}

{% block extra_css %}
<style>
    .register-container {
        max-width: 550px;
        margin: 2rem auto;
    }
    
    .register-header {
        text-align: center;
        margin-bottom: 2rem;
    }
    
    .register-card {
        border-radius: 10px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    }
    
    .register-form {
        padding: 1.5rem;
    }
    
    .form-step {
        display: none;
    }
    
    .form-step.active {
        display: block;
    }
    
    .steps-indicator {
        display: flex;
        justify-content: space-between;
        margin-bottom: 2rem;
        position: relative;
    }
    
    .steps-indicator::before {
        content: '';
        position: absolute;
        top: 14px;
        left: 0;
        right: 0;
        height: 2px;
        background-color: #e9ecef;
        z-index: 1;
    }
    
    .step-item {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background-color: #e9ecef;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: bold;
        color: #6c757d;
        position: relative;
        z-index: 2;
    }
    
    .step-item.active {
        background-color: #007bff;
        color: white;
    }
    
    .step-item.completed {
        background-color: #28a745;
        color: white;
    }
    
    .step-label {
        position: absolute;
        top: 35px;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
        font-size: 0.8rem;
    }
    
    .feedback-message {
        display: none;
        padding: 10px;
        margin-bottom: 15px;
        border-radius: 5px;
    }
    
    .feedback-message.success {
        display: block;
        background-color: #d4edda;
        border: 1px solid #c3e6cb;
        color: #155724;
    }
    
    .feedback-message.error {
        display: block;
        background-color: #f8d7da;
        border: 1px solid #f5c6cb;
        color: #721c24;
    }
    
    .loading {
        display: inline-block;
        width: 20px;
        height: 20px;
        border: 3px solid rgba(0, 123, 255, 0.3);
        border-radius: 50%;
        border-top-color: #007bff;
        animation: spin 1s ease-in-out infinite;
        margin-right: 10px;
        vertical-align: middle;
    }
    
    @keyframes spin {
        to { transform: rotate(360deg); }
    }
    
    .countdown {
        font-size: 0.9rem;
        color: #6c757d;
    }
    
    .field-error {
        color: #dc3545;
        font-size: 0.875rem;
        margin-top: 0.25rem;
    }
    
    .password-toggle {
        cursor: pointer;
        color: #6c757d;
    }
    
    .password-toggle:hover {
        color: #495057;
    }
</style>
{% endblock %}

{% block content %}
<div class="register-container">
    <div class="register-header">
        <h1>用户注册</h1>
        <p class="text-muted">创建您的账户，开始购物之旅</p>
    </div>
    
    <div class="card register-card">
        <div class="register-form">
            <div class="steps-indicator">
                <div class="step-item active" id="step1-indicator">
                    1
                    <span class="step-label">基本信息</span>
                </div>
                <div class="step-item" id="step2-indicator">
                    2
                    <span class="step-label">邮箱验证</span>
                </div>
                <div class="step-item" id="step3-indicator">
                    3
                    <span class="step-label">完成注册</span>
                </div>
            </div>
            
            <div id="feedback-message" class="feedback-message"></div>
            
            <form method="post" id="register-form" action="{% url 'register' %}{% if request.GET.next %}?next={{ request.GET.next }}{% endif %}">
                {% csrf_token %}
                
                <!-- 步骤1：基本信息 -->
                <div class="form-step active" id="step1">
                    <div class="mb-3">
                        <label for="id_username" class="form-label">用户名</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="bi bi-person"></i></span>
                            <input type="text" name="username" id="id_username" class="form-control" placeholder="请输入用户名" required>
                        </div>
                        <div class="form-text">用户名长度为3-20个字符，只能包含字母、数字和下划线</div>
                        <div class="field-error" id="username-error"></div>
                    </div>
                    
                    <div class="mb-3">
                        <label for="id_email" class="form-label">邮箱</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="bi bi-envelope"></i></span>
                            <input type="email" name="email" id="id_email" class="form-control" placeholder="请输入邮箱" required>
                        </div>
                        <div class="field-error" id="email-error"></div>
                    </div>
                    
                    <div class="mb-3">
                        <label for="id_password1" class="form-label">密码</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="bi bi-lock"></i></span>
                            <input type="password" name="password1" id="id_password1" class="form-control" placeholder="请输入密码" required>
                            <span class="input-group-text password-toggle" id="password1-toggle">
                                <i class="bi bi-eye"></i>
                            </span>
                        </div>
                        <div class="form-text">密码长度至少为8个字符，必须包含字母和数字</div>
                        <div class="field-error" id="password1-error"></div>
                    </div>
                    
                    <div class="mb-3">
                        <label for="id_password2" class="form-label">确认密码</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="bi bi-lock-fill"></i></span>
                            <input type="password" name="password2" id="id_password2" class="form-control" placeholder="请再次输入密码" required>
                            <span class="input-group-text password-toggle" id="password2-toggle">
                                <i class="bi bi-eye"></i>
                            </span>
                        </div>
                        <div class="field-error" id="password2-error"></div>
                    </div>
                    
                    <div class="mb-3 form-check">
                        <input type="checkbox" name="agree_terms" id="id_agree_terms" class="form-check-input" required>
                        <label for="id_agree_terms" class="form-check-label">我已阅读并同意<a href="#" class="text-decoration-none">用户协议</a>和<a href="#" class="text-decoration-none">隐私政策</a></label>
                        <div class="field-error" id="agree_terms-error"></div>
                    </div>
                    
                    <div class="d-grid gap-2">
                        <button type="button" class="btn btn-primary" id="step1-next">
                            <span id="step1-loading" class="loading d-none"></span>
                            <span id="step1-text">下一步</span>
                        </button>
                    </div>
                </div>
                
                <!-- 步骤2：邮箱验证 -->
                <div class="form-step" id="step2">
                    <div class="text-center mb-4">
                        <i class="bi bi-envelope-check" style="font-size: 3rem; color: #007bff;"></i>
                        <h4 class="mt-3">邮箱验证</h4>
                        <p class="text-muted">我们已向您的邮箱 <strong id="display-email"></strong> 发送了一封验证邮件</p>
                    </div>
                    
                    <div class="mb-3">
                        <label for="id_verification_code" class="form-label">验证码</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="bi bi-shield-lock"></i></span>
                            <input type="text" name="verification_code" id="id_verification_code" class="form-control" placeholder="请输入验证码" required>
                            <button class="btn btn-outline-secondary" type="button" id="resend-code">
                                <span id="resend-loading" class="loading d-none"></span>
                                <span id="resend-text">重新发送</span>
                                <span id="countdown" class="countdown d-none"></span>
                            </button>
                        </div>
                        <div class="field-error" id="verification_code-error"></div>
                    </div>
                    
                    <div class="d-flex justify-content-between mt-4">
                        <button type="button" class="btn btn-outline-secondary" id="step2-prev">上一步</button>
                        <button type="button" class="btn btn-primary" id="step2-next">
                            <span id="step2-loading" class="loading d-none"></span>
                            <span id="step2-text">验证</span>
                        </button>
                    </div>
                </div>
                
                <!-- 步骤3：完成注册 -->
                <div class="form-step" id="step3">
                    <div class="text-center mb-4">
                        <i class="bi bi-check-circle" style="font-size: 4rem; color: #28a745;"></i>
                        <h4 class="mt-3">注册成功</h4>
                        <p>恭喜您，账户已成功创建！</p>
                        <p class="text-muted">系统将在<span id="redirect-countdown">2</span>秒后自动跳转...</p>
                    </div>
                    
                    <div class="d-grid gap-2">
                        <a href="{% url 'login' %}{% if request.GET.next %}?next={{ request.GET.next }}{% endif %}" class="btn btn-primary" id="login-link">立即登录</a>
                        <a href="{% url 'index' %}" class="btn btn-outline-secondary" id="home-link">返回首页</a>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script>
    document.addEventListener('DOMContentLoaded', function() {
        // 获取元素
        const step1 = document.getElementById('step1');
        const step2 = document.getElementById('step2');
        const step3 = document.getElementById('step3');
        
        const step1Indicator = document.getElementById('step1-indicator');
        const step2Indicator = document.getElementById('step2-indicator');
        const step3Indicator = document.getElementById('step3-indicator');
        
        const step1Next = document.getElementById('step1-next');
        const step2Prev = document.getElementById('step2-prev');
        const step2Next = document.getElementById('step2-next');
        
        const emailInput = document.getElementById('id_email');
        const displayEmail = document.getElementById('display-email');
        const resendCodeBtn = document.getElementById('resend-code');
        const registerForm = document.getElementById('register-form');
        
        const feedbackMessage = document.getElementById('feedback-message');
        
        const step1Loading = document.getElementById('step1-loading');
        const step1Text = document.getElementById('step1-text');
        const step2Loading = document.getElementById('step2-loading');
        const step2Text = document.getElementById('step2-text');
        const resendLoading = document.getElementById('resend-loading');
        const resendText = document.getElementById('resend-text');
        const countdownSpan = document.getElementById('countdown');
        
        const password1Toggle = document.getElementById('password1-toggle');
        const password2Toggle = document.getElementById('password2-toggle');
        const password1Input = document.getElementById('id_password1');
        const password2Input = document.getElementById('id_password2');
        
        // 检查URL参数是否包含验证成功标记
        const urlParams = new URLSearchParams(window.location.search);
        const verificationSuccess = urlParams.get('verification_success');
        
        // 如果是验证成功，直接跳转到第三步
        if (verificationSuccess === 'true') {
            step1.classList.remove('active');
            step3.classList.add('active');
            
            step1Indicator.classList.remove('active');
            step1Indicator.classList.add('completed');
            step2Indicator.classList.add('completed');
            step3Indicator.classList.add('active');
            
            // 验证成功后自动跳转
            const redirectUrl = urlParams.get('redirect_url') || getRefererUrl() || '{% url "index" %}';
            
            // 添加倒计时
            const countdownElement = document.getElementById('redirect-countdown');
            let count = 2;
            
            const countdownInterval = setInterval(function() {
                count--;
                if (countdownElement) {
                    countdownElement.textContent = count;
                }
                
                if (count <= 0) {
                    clearInterval(countdownInterval);
                    window.location.href = redirectUrl;
                }
            }, 1000);
        }
        
        // 更新步骤3中的链接
        const refererUrl = getRefererUrl();
        if (refererUrl) {
            const loginLink = document.getElementById('login-link');
            const homeLink = document.getElementById('home-link');
            
            // 更新登录链接
            if (loginLink) {
                const loginUrl = new URL(loginLink.href);
                loginUrl.searchParams.set('next', refererUrl);
                loginLink.href = loginUrl.toString();
            }
            
            // 更新首页链接为refererUrl
            if (homeLink && refererUrl) {
                homeLink.href = refererUrl;
                homeLink.textContent = '返回上一页';
            }
        }
        
        // 密码显示/隐藏切换
        function setupPasswordToggle(toggleElement, inputElement) {
            toggleElement.addEventListener('click', function() {
                const type = inputElement.getAttribute('type') === 'password' ? 'text' : 'password';
                inputElement.setAttribute('type', type);
                
                // 更改图标
                const icon = toggleElement.querySelector('i');
                if (type === 'password') {
                    icon.classList.remove('bi-eye-slash');
                    icon.classList.add('bi-eye');
                } else {
                    icon.classList.remove('bi-eye');
                    icon.classList.add('bi-eye-slash');
                }
            });
        }
        
        // 设置密码切换功能
        setupPasswordToggle(password1Toggle, password1Input);
        setupPasswordToggle(password2Toggle, password2Input);
        
        // 清除所有错误信息
        function clearErrors() {
            document.querySelectorAll('.field-error').forEach(el => {
                el.textContent = '';
            });
            feedbackMessage.textContent = '';
            feedbackMessage.className = 'feedback-message';
        }
        
        // 显示错误信息
        function showErrors(errors) {
            for (const field in errors) {
                const errorElement = document.getElementById(`${field}-error`);
                if (errorElement) {
                    errorElement.textContent = errors[field].join(' ');
                }
            }
        }
        
        // 显示反馈消息
        function showFeedback(message, isSuccess) {
            feedbackMessage.textContent = message;
            feedbackMessage.className = isSuccess ? 
                'feedback-message success' : 
                'feedback-message error';
        }
        
        // 设置按钮加载状态
        function setButtonLoading(button, loadingEl, textEl, isLoading) {
            if (isLoading) {
                button.disabled = true;
                loadingEl.classList.remove('d-none');
                textEl.textContent = '处理中...';
            } else {
                button.disabled = false;
                loadingEl.classList.add('d-none');
                textEl.textContent = button === step1Next ? '下一步' : 
                                    button === step2Next ? '验证' : '重新发送';
            }
        }
        
        // 重发验证码倒计时
        let countdownTimer;
        function startCountdown(seconds) {
            let remainingSeconds = seconds;
            resendCodeBtn.disabled = true;
            resendText.classList.add('d-none');
            countdownSpan.classList.remove('d-none');
            
            countdownTimer = setInterval(() => {
                countdownSpan.textContent = `(${remainingSeconds}s)`;
                remainingSeconds--;
                
                if (remainingSeconds < 0) {
                    clearInterval(countdownTimer);
                    resendCodeBtn.disabled = false;
                    resendText.classList.remove('d-none');
                    countdownSpan.classList.add('d-none');
                }
            }, 1000);
        }
        
        // 添加倒计时
        let checkVerificationTimer;
        
        // 在步骤2中添加定时检查验证状态
        function startVerificationCheck() {
            // 每3秒检查一次邮箱是否已验证
            checkVerificationTimer = setInterval(() => {
                const email = emailInput.value;
                if (!email) return;
                
                const checkData = new FormData();
                checkData.append('email', email);
                checkData.append('csrfmiddlewaretoken', document.querySelector('[name=csrfmiddlewaretoken]').value);
                
                fetch('{% url "check_verification" %}', {
                    method: 'POST',
                    body: checkData,
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                })
                .then(response => response.json())
                .then(data => {
                    if (data.is_verified) {
                        // 清除定时器
                        clearInterval(checkVerificationTimer);
                        
                        // 显示验证成功
                        step2.classList.remove('active');
                        step3.classList.add('active');
                        
                        step2Indicator.classList.remove('active');
                        step2Indicator.classList.add('completed');
                        step3Indicator.classList.add('active');
                        
                        // 验证成功后自动跳转
                        const refererUrl = getRefererUrl();
                        let redirectUrl = refererUrl || data.redirect_url || '{% url "index" %}';
                        
                        // 添加倒计时
                        const countdownElement = document.getElementById('redirect-countdown');
                        let count = 2;
                        
                        const countdownInterval = setInterval(function() {
                            count--;
                            if (countdownElement) {
                                countdownElement.textContent = count;
                            }
                            
                            if (count <= 0) {
                                clearInterval(countdownInterval);
                                window.location.href = redirectUrl;
                            }
                        }, 1000);
                    }
                })
                .catch(error => {
                    console.error('Error checking verification status:', error);
                });
            }, 3000);
        }
        
        // 获取来源URL
        function getRefererUrl() {
            // 首先尝试从URL参数获取
            const urlParams = new URLSearchParams(window.location.search);
            const nextUrl = urlParams.get('next');
            if (nextUrl) {
                return nextUrl;
            }
            
            // 尝试从localStorage获取
            const refererUrl = localStorage.getItem('refererUrl');
            return refererUrl;
        }
        
        // 保存当前页面URL作为referer
        function saveCurrentUrlAsReferer() {
            // 不保存登录和注册页面
            if (!window.location.pathname.includes('login') && 
                !window.location.pathname.includes('register')) {
                localStorage.setItem('refererUrl', window.location.href);
            }
        }
        
        // 在页面加载时保存来源URL
        saveCurrentUrlAsReferer();
        
        // 步骤1 -> 步骤2
        step1Next.addEventListener('click', function() {
            // 清除之前的错误
            clearErrors();
            
            // 表单验证
            if (validateStep1()) {
                // 设置加载状态
                setButtonLoading(step1Next, step1Loading, step1Text, true);
                
                // 获取表单数据
                const formData = new FormData();
                formData.append('username', document.getElementById('id_username').value);
                formData.append('email', emailInput.value);
                formData.append('password1', document.getElementById('id_password1').value);
                formData.append('password2', document.getElementById('id_password2').value);
                formData.append('csrfmiddlewaretoken', document.querySelector('[name=csrfmiddlewaretoken]').value);
                
                // 添加referer URL
                const refererUrl = getRefererUrl();
                if (refererUrl) {
                    formData.append('next_url', refererUrl);
                }
                
                // 发送AJAX请求
                fetch('{% url "register" %}', {
                    method: 'POST',
                    body: formData,
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    }
                })
                .then(response => {
                    if (response.ok) {
                        return response.json();
                    }
                    throw new Error('注册请求失败');
                })
                .then(data => {
                    // 恢复按钮状态
                    setButtonLoading(step1Next, step1Loading, step1Text, false);
                    
                    if (data.success) {
                        // 成功发送验证邮件，切换到步骤2
                        step1.classList.remove('active');
                        step2.classList.add('active');
                        
                        step1Indicator.classList.remove('active');
                        step1Indicator.classList.add('completed');
                        step2Indicator.classList.add('active');
                        
                        // 显示用户邮箱
                        displayEmail.textContent = emailInput.value;
                        
                        // 开始重发验证码倒计时
                        startCountdown(60);
                        
                        // 开始定时检查验证状态
                        startVerificationCheck();
                    } else {
                        // 显示错误信息
                        if (data.errors) {
                            showErrors(data.errors);
                        } else {
                            showFeedback(data.message || '注册失败，请检查您的输入', false);
                        }
                    }
                })
                .catch(error => {
                    // 恢复按钮状态
                    setButtonLoading(step1Next, step1Loading, step1Text, false);
                    
                    console.error('Error:', error);
                    showFeedback('注册过程中出现错误，请稍后重试', false);
                });
            }
        });
        
        // 步骤2 -> 步骤1
        step2Prev.addEventListener('click', function() {
            // 清除倒计时
            if (countdownTimer) {
                clearInterval(countdownTimer);
            }
            
            // 清除验证状态检查
            if (checkVerificationTimer) {
                clearInterval(checkVerificationTimer);
            }
            
            step2.classList.remove('active');
            step1.classList.add('active');
            
            step2Indicator.classList.remove('active');
            step1Indicator.classList.remove('completed');
            step1Indicator.classList.add('active');
            
            // 清除验证码输入
            document.getElementById('id_verification_code').value = '';
            
            // 清除错误信息
            clearErrors();
        });
        
        // 步骤2 -> 步骤3 (验证码验证)
        step2Next.addEventListener('click', function() {
            // 清除错误信息
            clearErrors();
            
            const verificationCode = document.getElementById('id_verification_code').value;
            
            if (!verificationCode) {
                document.getElementById('verification_code-error').textContent = '请输入验证码';
                return;
            }
            
            // 设置加载状态
            setButtonLoading(step2Next, step2Loading, step2Text, true);
            
            // 发送验证码验证请求
            const formData = new FormData();
            formData.append('verification_code', verificationCode);
            formData.append('email', emailInput.value);
            formData.append('csrfmiddlewaretoken', document.querySelector('[name=csrfmiddlewaretoken]').value);
            
            // 添加next参数（如果存在）
            const urlParams = new URLSearchParams(window.location.search);
            const nextUrl = urlParams.get('next');
            if (nextUrl) {
                formData.append('next_url', nextUrl);
            }
            
            fetch('{% url "verify_code" %}', {
                method: 'POST',
                body: formData,
                headers: {
                    'X-Requested-With': 'XMLHttpRequest'
                }
            })
            .then(response => {
                if (response.ok) {
                    return response.json();
                }
                throw new Error('验证请求失败');
            })
            .then(data => {
                // 恢复按钮状态
                setButtonLoading(step2Next, step2Loading, step2Text, false);
                
                if (data.success) {
                    // 验证成功，切换到步骤3
                    step2.classList.remove('active');
                    step3.classList.add('active');
                    
                    step2Indicator.classList.remove('active');
                    step2Indicator.classList.add('completed');
                    step3Indicator.classList.add('active');
                    
                    // 清除倒计时
                    if (countdownTimer) {
                        clearInterval(countdownTimer);
                    }
                    
                    // 验证成功后自动跳转
                    if (data.redirect_url) {
                        // 添加倒计时
                        const countdownElement = document.getElementById('redirect-countdown');
                        let count = 2;
                        
                        const countdownInterval = setInterval(function() {
                            count--;
                            if (countdownElement) {
                                countdownElement.textContent = count;
                            }
                            
                            if (count <= 0) {
                                clearInterval(countdownInterval);
                                // 优先使用保存的refererUrl
                                const refererUrl = getRefererUrl();
                                window.location.href = refererUrl || data.redirect_url;
                            }
                        }, 1000);
                    }
                } else {
                    document.getElementById('verification_code-error').textContent = data.message || '验证码错误';
                }
            })
            .catch(error => {
                // 恢复按钮状态
                setButtonLoading(step2Next, step2Loading, step2Text, false);
                
                console.error('Error:', error);
                showFeedback('验证过程中出现错误，请稍后重试', false);
            });
        });
        
        // 重新发送验证码
        resendCodeBtn.addEventListener('click', function() {
            // 清除错误信息
            clearErrors();
            
            // 设置加载状态
            setButtonLoading(resendCodeBtn, resendLoading, resendText, true);
            
            const formData = new FormData();
            formData.append('email', emailInput.value);
            formData.append('csrfmiddlewaretoken', document.querySelector('[name=csrfmiddlewaretoken]').value);
            
            // 添加next参数（如果存在）
            const urlParams = new URLSearchParams(window.location.search);
            const nextUrl = urlParams.get('next');
            if (nextUrl) {
                formData.append('next_url', nextUrl);
            }
            
            fetch('{% url "resend_verification" %}', {
                method: 'POST',
                body: formData,
                headers: {
                    'X-Requested-With': 'XMLHttpRequest'
                }
            })
            .then(response => {
                if (response.ok) {
                    return response.json();
                }
                throw new Error('重发验证码请求失败');
            })
            .then(data => {
                // 恢复按钮状态
                setButtonLoading(resendCodeBtn, resendLoading, resendText, false);
                
                if (data.success) {
                    showFeedback('验证码已重新发送到您的邮箱', true);
                    // 开始倒计时
                    startCountdown(60);
                } else {
                    showFeedback(data.message || '重发验证码失败', false);
                }
            })
            .catch(error => {
                // 恢复按钮状态
                setButtonLoading(resendCodeBtn, resendLoading, resendText, false);
                
                console.error('Error:', error);
                showFeedback('重发验证码过程中出现错误，请稍后重试', false);
            });
        });
        
        // 表单验证
        function validateStep1() {
            const username = document.getElementById('id_username').value;
            const email = emailInput.value;
            const password1 = document.getElementById('id_password1').value;
            const password2 = document.getElementById('id_password2').value;
            const agreeTerms = document.getElementById('id_agree_terms').checked;
            
            let isValid = true;
            
            // 用户名验证
            if (username.length < 3 || username.length > 20 || !/^[a-zA-Z0-9_]+$/.test(username)) {
                document.getElementById('username-error').textContent = '用户名长度为3-20个字符，只能包含字母、数字和下划线';
                isValid = false;
            }
            
            // 邮箱验证
            if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
                document.getElementById('email-error').textContent = '请输入有效的邮箱地址';
                isValid = false;
            }
            
            // 密码验证
            if (password1.length < 8 || !/[a-zA-Z]/.test(password1) || !/[0-9]/.test(password1)) {
                document.getElementById('password1-error').textContent = '密码长度至少为8个字符，必须包含字母和数字';
                isValid = false;
            }
            
            // 确认密码
            if (password1 !== password2) {
                document.getElementById('password2-error').textContent = '两次输入的密码不一致';
                isValid = false;
            }
            
            // 用户协议
            if (!agreeTerms) {
                document.getElementById('agree_terms-error').textContent = '请阅读并同意用户协议和隐私政策';
                isValid = false;
            }
            
            return isValid;
        }
    });
</script>
{% endblock %}